<template>
  <div class="custom-table-list-wrapper">
    <template v-if="currentDeviceTypeName === '摄像机'">
      <Camera :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '门磁人脸识别机'">
      <MagnetFace :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '翼闸人脸识别机'">
      <Face :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '行车道闸'">
      <CarGates :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '监测设备'">
      <MonitorDevice :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === 'GNSS监测一体机'">
      <Gnss :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '硬盘录像机'">
      <Nvr :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '报警设备'">
      <AlertDevice :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '存储服务器'">
      <Storage :current-type="currentType" :park-list="parkList" />
    </template>
    <template v-if="currentDeviceTypeName === '萤石云摄像机'">
      <YsyCamera :current-type="currentType" :park-list="parkList" />
    </template>
  </div>
</template>

<script setup>
import { computed } from 'vue'

import AlertDevice from './components/device/alertDevice/alertDevice.vue'
import Camera from './components/device/camera/camera.vue'
import CarGates from './components/device/carGates/carGates.vue'
import Face from './components/device/face/face.vue'
import Gnss from './components/device/gnss/gnss.vue'
import MagnetFace from './components/device/magnetFace/face.vue'
import MonitorDevice from './components/device/monitorDevice/monitorDevice.vue'
import Nvr from './components/device/nvr/nvr.vue'
import Storage from './components/device/storage/storage.vue'
import YsyCamera from './components/device/ysyCamera/camera.vue'

const props = defineProps({
  currentType: {
    type: String,
    default: '',
  },
  deviceTypeList: {
    type: Array,
    default: [],
  },
  parkList: {
    type: Array,
    default: [],
  },
})

/**
 * 当前设备类型名称
 */
const currentDeviceTypeName = computed(
  () =>
    props.deviceTypeList.find((item) => item.value === props.currentType)
      ?.name || '',
)
</script>
